<template>
  <div>
    <template v-if="listData.length">
      <el-tabs
        class="classify-tabs"
        @tab-click="handleTabClick"
        :tab-position="tabPosition"
        type="border-card"
      >
        <el-tab-pane
          v-for="(item,index) in listData"
          :key="index"
          :label="item.name + (item.finished === 1 ? '(已提交)' : '(未提交)') "
        >
          <test-classify @refresh="handleRefresh" :arr="listData" :list="item" ref="testClassify" />
        </el-tab-pane>
      </el-tabs>
    </template>
    <template v-else>
      <empty-comp ref="emptyComp" />
    </template>
  </div>
</template>

<script>
import TestClassify from './TestClassify'
import { getInternalTaskDetailVO } from '@/api/satisfaction'
export default {
  components: {
    TestClassify
  },
  data() {
    return {
      tabPosition: 'left',
      index: 0,
      listData: [],
      totalScore: null,
      totalMoney: null
    }
  },
  methods: {
    handleTabClick(tab, event) {
      console.log('item', tab, event)
      let index = parseInt(tab.index)
      this.index = parseInt(tab.index)
      let param = this.listData[index]
      console.log('param', param)
      if (param.internalTypeVOList && param.internalTypeVOList.length > 0) {
      } else {
        let targetId = param.targetUserId ? param.targetUserId : param.targetDeptId
        let { internalPlanId, internalTaskId, targetMode } = param
        this.getDetail({ internalPlanId, internalTaskId, targetMode, targetId })
      }
    },
    async getDetail(param) {
      const res = await getInternalTaskDetailVO(param)
      if (res.state === '000000') {
        this.$set(this.listData[this.index], 'internalTypeVOList', res.data)
      }
      // this.$nextTick(() => {
      //   this.$refs.testClassify.edit(this.mdl)
      // })
    },
    getData(arr, refresh = false) {
      console.log('getData arr', arr, refresh)
      this.listData = arr
      if (this.listData.length > 0) {
        let index = refresh ? this.index : 0
        let param = this.listData[index]
        let targetId = param.targetUserId ? param.targetUserId : param.targetDeptId
        let { internalPlanId, internalTaskId, targetMode } = param
        this.getDetail({ internalPlanId, internalTaskId, targetMode, targetId })
      }
    },
    handleRefresh() {
      let param = this.listData[this.index]
      let targetId = param.targetUserId ? param.targetUserId : param.targetDeptId
      let { internalPlanId, internalTaskId, targetMode } = param
      this.getDetail({ internalPlanId, internalTaskId, targetMode, targetId })
      this.$set(this.listData[this.index], 'finished', 1)
    }
  }
}
</script>

<style scoped>
.classify-tabs >>> .el-tabs__header {
  margin-right: 0;
}
.classify-tabs >>> .el-tabs__content {
  padding: 0;
}
.classify-tabs >>> .el-tabs__item {
  text-align: center;
}

.classify-tabs >>> .el-tabs__nav-scroll {
  max-height: 500px;
}
</style>
